<!DOCTYPE html>
<html class="no-js" lang="zxx" xmlns:v-on="http://www.w3.org/1999/xhtml" xmlns:v-bind="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="meta description">
    <title>商家查看</title>

    <!--=== Favicon ===-->
    <link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon" />

    <!-- Google fonts include -->
    <link href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,900%7CYesteryear" rel="stylesheet">

    <!-- All Vendor & plugins CSS include -->
    <link href="css/vendor.css" rel="stylesheet">
    <!-- Main Style CSS -->
    <link href="css/style.css" rel="stylesheet">
    <link href="css/bootstrap.css" rel="stylesheet">
    <!--[if lt IE 9]>
<script src="/oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="/oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->

</head>

<body>

    <!-- Start Header Area -->
    <header class="header-area">
        <!-- main header start -->
        <div class="main-header d-none d-lg-block">
            <!-- header top start -->
            <div class="header-top bdr-bottom">
                <div class="container">
                    <div class="row align-items-center">
                        <div class="col-lg-6">
                            <div class="welcome-message">
                                <p>欢迎光临花语在线订花系统</p>
                            </div>
                        </div>
                        <div class="col-lg-6 text-right">
                            <div class="header-top-settings">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- header top end -->
    
            <!-- header middle area start -->
            <div class="header-main-area sticky">
                <div class="container" >
                    <div class="row align-items-center position-relative">
    					
                        <!-- start logo area -->
                        <div class="col-lg-3">
                            <div class="logo">
                                <a href="index.html">
    								<h2>HUA YU </h2>
                                </a>
                            </div>
                        </div>
                        <!-- start logo area -->
    
                        <!-- main menu area start -->
                        <div class="col-lg-6 position-static">
                            <div class="main-menu-area">
                                <div class="main-menu">
                                    <!-- main menu navbar start -->
                                    <nav class="desktop-menu">
                                        <ul >
                                            <li><a href="index.html">主页</a></li>
                                            <li><a href="store.html">查看商家</a></li>
                                            <li><a href="shopping.html">查看购物车</a></li>
                                        </ul>
                                    </nav>
                                    <!-- main menu navbar end -->
                                </div>
                            </div>
                        </div>
                        <!-- main menu area end -->
    
                        <!-- mini cart area start -->
                        <div class="col-lg-3">
                            <div class="header-configure-wrapper">
                                <div class="header-configure-area">
                                    <ul class="nav justify-content-end">
                                        <li class="user-hover">
                                            <a href="#" title="个人中心">
                                                <i class="lnr lnr-user"></i>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="#">
                                                <h4>退出</h4>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <!-- mini cart area end -->
    
                    </div>
                </div>
            </div>
            <!-- header middle area end -->
        </div>
        <!-- main header start -->
    </header>
    <!-- end Header Area -->

    <!-- main wrapper start -->
    <main>
        <div class="container" id="container">
        <!-- breadcrumb area start -->
        <div class="breadcrumb-area common-bg">
            <div class="container" >
                <div class="row">
                    <div class="col-12">
                        <div class="breadcrumb-wrap">
                            <nav aria-label="breadcrumb">
                                <h1>查看商家</h1>
								<br>
                                <input  type="text" placeholder="请输入商家名称" id="storename" v-model="sname"/>
								<button type="button" class="btn btn-danger" id="searchstore" v-on:click="querystorebyname(sname)">搜索</button>
                            </nav>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- breadcrumb area end -->

        <!-- page main wrapper start -->
        <div class="shop-main-wrapper section-space pb-0">
            <div class="container">
                <div class="row">
                    <!-- shop main wrapper start -->
                    <!--v-for="store in data.data"-->
                    <div class="col-lg-9 order-1 order-lg-2" id="divmain" >
                            <!-- product item list wrapper start -->
                            <div class="shop-product-wrap grid-view row mbn-40">
                                <!-- product single item start -->
                                <div class="col-md-4 col-sm-6" v-for="obj in result.data">
                                    <!-- product grid start -->
                                    <div class="product-item">
                                        <figure class="product-thumb">
                                            <a href="#" v-on:click="searchFlower(obj.sid)">
                                                <img v-bind:src="obj.simg" alt="store">
                                            </a>
                                        </figure>
                                        <div class="product-caption">
                                            <p class="product-name">
                                                <a href="#" v-on:click="searchFlower(obj.sid)">商家名称:{{obj.sname}}</a>
                                            </p>
                                            <div class="price-box">
                                                <span class="price-regular">联系方式:{{obj.phone}}</span>
                                            </div>
                                            <div class="price-box">
                                                <span class="price-regular">地址:{{obj.saddress}}</span>
                                            </div>
                                            <div class="price-box">
                                                <span class="price-regular">销量:{{obj.total}}</span>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- product grid end -->
                                </div>

                            <!-- start pagination area -->
                           
                            <!-- end pagination area -->
                        </div>
                        <div class="paginatoin-area text-center">
                            <ul class="pagination-box">
                                <li><a class="previous" href="#" v-on:click="prePage"><i class="lnr lnr-chevron-left"></i></a></li>
                                <li v-on:click="goToPage(count)"   v-for="count in result.pageCount" ><a href="#">{{count}}</a></li>
                                <li><a class="next" href="#" v-on:click="nextPage"><i class="lnr lnr-chevron-right"></i></a></li>
                            </ul>
                        </div>
                    </div>
					
                    <!-- shop main wrapper end -->
                </div>

            </div>
        </div>
        <!-- page main wrapper end -->
        </div>
    </main>

    <script src="js/vendor.js"></script>
    <!-- Active Js -->
    <script src="js/active.js"></script>
</body>
<script src="js/jquery-3.2.1.js"></script>
<script src="js/layer/layer.js"></script>
<script src="js/Vue-2.6.11.js"></script>
<script src="js/axios.min.js"></script>
<script src="js/global.js"></script>
<script>
    var currentPage=1;
    var vm=new Vue({
        el:"#container",
        data:{
            sname:'',
            result:{},
        },
        methods:{
            querystorebyname:function (sname) {
               axios.get("user/querystorebyname",{params:{currentPage:currentPage,sname:sname}}).then(function (res) {
                    vm.result=res.data;
               })
            },
            goToPage:function (page) {
                currentPage=page;
                this.querystorebyname(this.sname);
            },
            prePage:function () {
                currentPage--;
                if(currentPage<1){
                    currentPage=1;
                }
                this.querystorebyname(this.sname);
            },
            nextPage:function () {
                currentPage++;
                if(currentPage>this.result.pageCount){
                    currentPage=this.result.pageCount;
                }
                this.querystorebyname(this.sname);
            },
            searchFlower:function (sid) {
                location.href="searchflower.html?sid="+sid;
            }
        },
        mounted:function () {
            this.querystorebyname();
        }
    })



</script>

</html>
